<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>德令的项目博客</title>
    <link rel="stylesheet" href="css/Blog.css">
    <link rel="stylesheet" href="css/iconfont.css">
    <link rel="stylesheet" href="css/animate.css">
    <script src="js/bootstrap.js"></script>
    <script src="js/jquery-3.5.0.min.js"></script>


    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <style>
        /*图片轮播*/
        @keyframes move {
            0% {
                background-image: url("./images/1.jpg");
                background-size: cover;
            }
            20% {
                background-image: url("./images/2.jpg");
                background-size: cover;
            }
            40% {
                background-image: url("./images/3.jpg");
                background-size: cover;
            }
            60% {
                background-image: url("images/4.jpg");
                background-size: cover;
            }
            80% {
                background-image: url("images/5.jpg");
                background-size: cover;
            }
            100% {
                background-image: url("images/1.jpg");
                background-size: cover;
            }
        }
    </style>

</head>
<body>
<div class="wrap">
    <!---个人博客--->
    <nav class="navbar navbar-expand-md bg-dark navbar-dark">
        <a class="navbar-brand" href="FinalBlog.html">我的个人博客</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="collapsibleNavbar">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <a class="nav-link" href="index.html">首页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="Blog_tech.html">博文技术</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="album.html">我的相册</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="Rest.html">休息娱乐</a>
                </li>
            </ul>
            <div class="hnav"></div>
            <div id="mycolor">
                <ul>
                    <li></li>
                    <li></li>
                    <li></li>
                </ul>
            </div>
        </div>
    </nav>

    <!--main begain-->
    <main class="container">
        <div class="row">
            <!--图片轮播-->
            <div class="one col-sm-12 col-md-12 col-lg-4"></div>
            <!--headline begin-->
            <div class="headline col-sm-12 col-md-12 col-lg-4">
                <ul>
                    <li><a href="https://zhuanlan.zhihu.com/p/88101637" title="为什么说10月24日是程序员的节日？">
                        <img src="images/6.jpg" alt="为什么说10月24日是程序员的节日？">
                        <span style="color: white;font-size: 20px; font-weight: bold">为什么说10月24日是程序员的节日？</span>
                    </a>
                    </li>
                    <li><a href="#" title="个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。">
                        <img src="images/7.jpg" alt="个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。">
                        <span style="color: white; font-size: 20px ;font-weight: bold">个人网站做好了，百度不收录怎么办？来，看看他们怎么做的。</span>
                    </a>
                    </li>
                </ul>
            </div>
            <!--headline end-->

            <!--------------我的名片------------------>
            <div class="main col-sm-12 col-md-12 col-lg-4">
                <div class="rbox">
                    <div class="card">
                        <div class="pic"><img src="images/234.jpg" style="width: 100px; height: 100px; border-radius: 50%; float: right; margin-right: 20px;padding-top: 10px"></div>
                        <h2>我的名片</h2>
                        <p>网名：Stranger | 即步非烟</p>
                        <p>班级：1790005</p>
                        <p>现居：重庆市-巫山县</p>
                        <p>Email：653266471@qq.com</p>
                        <ul class="linkmore">
                            <li><a href="http://www.yangqq.com" target="_blank" class="iconfont icon-home" title="网站地址"></a></li>
                            <li><a href="http://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=653266471@qq.com" target="_blank" class="iconfont icon-youxiang" title="我的邮箱"></a></li>
                            <li><a href="http://wpa.qq.com/msgrd?v=3&uin=653266471&site=qq&menu=yes" target="_blank" class="iconfont icon-QQ" title="QQ联系我"></a></li>
                            <li id="weixin"><a href="#" target="_blank" class="iconfont icon-weixin" title="关注我的微信"></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </main>
    <!--main end-->

    <div class="container">
        <div class="row">
            <!--博客网站-->
            <div class="tab_box whitebg col-sm-12 col-md-12 col-lg-7">
                <h3>博文内容</h3>
                <ul class="newslist">
                   <li><i></i><a href="#" title="安静地做一个爱设计的女子">安静地做一个爱设计的女子</a><p>自从入了这行，很多人跟我说可以做网络教程，我也有考虑，但最终没有实现，因为我觉得在这个教程泛滥的时代，直接做一套免费的原创个人博客模板更为实在。每当看到自己喜欢的配色图片</p></li>
                   <li><i></i><a href="#" title="电话以外的宁静">电话以外的宁静</a><p>电话很久没有响过了，我的QQ也很久没有在线了，消失了很多天，刚刚结识的朋友因为我身上又起了红疹，每天都发来消息询问我的情况，我做到了这么多天来的沉默，我相信，没有网络，我还是可以继续我自己的生活</p></li>
                   <li><i></i><a href="#" title="遇见一个未知的你">遇见一个未知的你</a><p>听着那熟悉的歌曲看着那一张张可爱的图片.-读着我们共同欣赏的诗……也许我们曾经相遇,看着你远去的背影 ,沿着你来的方向 ,回忆时间穿梭于幸福的点点滴滴....</p></li>
                   <li><i></i><a href="#" title="个人网站做好了，百度不收录怎么办？来，看看他们怎么做的">个人网站做好了，百度不收录怎么办？来，看看他们怎么做的...</a><p>不管你是学前端的还是后端的，作为一个程序员，做一个自己的博客，那是必然的。咱们的圈子就这么大，想让更多的人了解你，看看你的技术多牛逼，扔一个博客地址就行了</p></li>
                   <li><i></i><a href="#" title="个人博客，属于我的小世界！">个人博客，属于我的小世界！</a><p>个人博客，用来做什么？我刚开始就把它当做一个我吐槽心情的地方，也就相当于一个网络记事本，写上一些关于自己生活工作中的小情小事，也会放上一些照片，音乐。每天工作回家后就能访问自己的网站，一边听着音乐，一边写写文章。</p></li>
                </ul>
            </div>
            <!---学习网站--->
            <div class="study col-sm-12 col-md-12 col-lg-4">
                <h3 class="iconfont icon-xuexi">学习网站</h3>
                <ul>
                    <li><a href="https://www.runoob.com/">菜鸟教程</a></li>
                    <li><a href="https://www.w3school.com.cn/">w3scholl</a></li>
                    <li><a href="https://www.csdn.net/">CSDN首页</a></li>
                    <li><a href="https://next.xuetangx.com/">学堂在线</a></li>
                    <li><a href="https://www.w3cways.com/css/">CSS参考手册v4.0_web前端开发参考手册系列</a></li>
                    <li><a href="https://www.runoob.com/">菜鸟教程</a></li>
                    <li><a href="https://www.w3school.com.cn/">w3scholl</a></li>
                    <li><a href="https://www.csdn.net/">CSDN首页</a></li>
                    <li><a href="https://next.xuetangx.com/">学堂在线</a></li>
                    <li><a href="https://www.w3cways.com/css/">CSS参考手册v4.0_web前端开发参考手册系列</a></li>
                    <li><a href="https://www.runoob.com/">菜鸟教程</a></li>
                </ul>
                <ul class="clear">
                    <li>大众评分： <meter optimum="0.5" low="0.1" high="0.5" value="0.6"></meter> </li>
                    <li>媒体评分： <meter optimum="0.5" low="0.1" high="1" value="0.8"></meter> </li>
                    <li>网络评分： <meter optimum="0.9" low="0.4" high="0.8" value="0.3"></meter> </li>
                </ul>
            </div>
        </div>

    </div>
    <!---页脚--->
    <div class="foot">
        <footer>Copyright@wangdeling</footer>
    </div>
</div>
<script src="js/Color.js"></script>
</body>
</html>